﻿<!DOCTYPE html>
<html lang="en">
<head>
	<title>Cart</title>
	<meta charset="utf-8" />

	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<!-- GOOGLE WEB FONTS -->
	<link rel="stylesheet" href="css/font-awesome.min.css">

	<!-- BOOTSTRAP 3.3.7 CSS -->
	<link rel="stylesheet" href="css/bootstrap.min.css" />

	<!-- SLICK v1.6.0 CSS -->
	<link rel="stylesheet" href="css/slick-1.6.0/slick.css" />

	<link rel="stylesheet" href="css/jquery.fancybox.css" />
	<link rel="stylesheet" href="css/yith-woocommerce-compare/colorbox.css" />
	<link rel="stylesheet" href="css/owl-carousel/owl.carousel.min.css" />
	<link rel="stylesheet" href="css/owl-carousel/owl.theme.default.min.css" />
	<link rel="stylesheet" href="css/js_composer/js_composer.min.css" />
	<link rel="stylesheet" href="css/woocommerce/woocommerce.css" />
	<link rel="stylesheet" href="css/woocommerce/woocommerce-layout.css" />
	<link rel="stylesheet" href="css/woocommerce/woocommerce-smallscreen.css" />
	<link rel="stylesheet" href="css/yith-woocommerce-wishlist/style.css" />
	<link rel="stylesheet" href="css/custom.css" />
	<link rel="stylesheet" href="css/app-orange.css" id="theme_color" />
	<link rel="stylesheet" href="" id="rtl" />
	<link rel="stylesheet" href="css/app-responsive.css" />
</head>

<body class="page woocommerce-cart woocommerce-page">
<div class="body-wrapper theme-clearfix" id="app">
	<header id="header" class="header header-style1">
		<div class="header-top clearfix">
			<div class="container">
				<div class="rows">
					<div class="wrap-myacc pull-right">
						<div class="sidebar-account pull-left">
							<div class="account-title">个人中心</div>

							<div id="my-account" class="my-account">
								<div class="widget-1 widget-first widget nav_menu-4 widget_nav_menu">
									<div class="widget-inner">
										<ul id="menu-my-account" class="menu">
											<li class="menu-my-account">
												<a class="item-link" href="my_account.html">
													<span class="menu-title">我的账户</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
								<div class="widget-2 widget-last widget sw_top-4 sw_top">
									<div class="widget-inner">
										<div class="top-login">
											<div class="div-logined">
												<ul>
													<li>
														<a href="cart.html">
															<span>我的收藏</span>
														</a>
													</li>
												</ul>
											</div>
										</div>
									</div>
								</div>
								<div class="widget-2 widget-last widget sw_top-4 sw_top">
									<div class="widget-inner">
										<div class="top-login">
											<div class="div-logined">
												<ul>
													<li>
														<a href="login.html">
															<span>登录/注册</span>
														</a>
													</li>
												</ul>
											</div>
										</div>
									</div>
								</div>
								<div class="widget-2 widget-last widget sw_top-4 sw_top">
									<div class="widget-inner">
										<div class="top-login">
											<div class="div-logined">
												<ul>
													<li>
														<a @click="loginout" href="login.html">
															<span>退出登录</span>
														</a>
													</li>
												</ul>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>

						<div class="pull-left top2">
							<div class="widget-1 widget-first widget nav_menu-2 widget_nav_menu">
								<div class="widget-inner">
									<ul id="menu-checkout" class="menu">
										<li class="menu-checkout">
											<a class="item-link" href="checkout.html">
												<span class="menu-title">欢迎来到Cabbage</span>
											</a>
										</li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="header-mid clearfix">
			<div class="container">
				<div class="rows">
					<!-- 右上LOGO -->
					<div class="etrostore-logo pull-left">
						<br>
						<br>
						<h1 style="color:orange">CABBAGE</h1>
						<H4 style="color:rgb(189, 189, 189)">Your Online Bookstore</H4>
					</div>
					<!-- /右上LOGO -->
					<div class="mid-header pull-right">
						<div class="widget-1 widget-first widget sw_top-2 sw_top">
							<div class="widget-inner">
								<div class="top-form top-search">
									<div class="topsearch-entry">
										<form method="get" action="">
											<div>
												<input type="text" value="" name="s" placeholder="Enter your book...">
												<button type="submit" title="Search" class="fa fa-search button-search-pro form-button"></button>
											</div>
										</form>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="header-bottom clearfix">
			<div class="container">
				<div class="rows">

				</div>
			</div>
		</div>
	</header>

	<div class="container">
		<div class="row">
			<div id="contents" role="main" class="main-page col-lg-12 col-md-12 col-sm-12 col-xs-12">
				<div class="page type-page status-publish hentry">
					<div class="entry-content">
						<div class="entry-summary">
							<div class="woocommerce">
								<form action="" method="post">
									<table class="shop_table shop_table_responsive cart" cellspacing="0">
										<thead>
										<tr>
											<th class="product-remove">&nbsp;</th>
											<th class="product-thumbnail">&nbsp;</th>
											<th class="product-name">图书名称</th>
											<th class="product-price">价格</th>
											<th class="product-quantity">作者</th>
											<th class="product-subtotal">ISBN</th>
										</tr>
										</thead>
										<tbody>
										<!--第一行商品-->
										<tr class="cart_item" v-for="cartlst in cartList">
											<td class="product-remove">
												<a href="#" class="remove" title="Remove this item" @click="delcoll(cartlst.collectId)"><i class="fa fa-times" aria-hidden="true"></i></a>
											</td>

											<td class="product-thumbnail">
												<a href="simple_product.html">
													<img width="300" height="300" :src="cartlst.image">
												</a>
											</td>

											<td class="product-name" data-title="Product">
												<a href="simple_product.html">{{cartlst.bookName}}</a>
											</td>

											<td class="product-price" data-title="Price">
												<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">￥</span>{{cartlst.bookPrice}}</span>
											</td>

											<td class="product-quantity" data-title="Quantity">
												<span class="woocommerce-Price-amount amount">{{cartlst.writer}}</span>
											</td>

											<td class="product-subtotal" data-title="Total">
												<span class="woocommerce-Price-amount amount">{{cartlst.ISBN}}</span>
											</td>
										</tr>
										</tbody>
									</table>
								</form>
							</div>
						</div>
					</div>

					<div class="clearfix"></div>
				</div>
			</div>
		</div>
	</div>

	<footer id="footer" class="footer default theme-clearfix">
		<div class="footer-copyright style1">
			<div class="container">
				<!-- Copyright text -->
				<div class="copyright-text ">
					<center><p>Copyright &copy; 2022.Company name All rights reserved.cabbage</p></center>
				</div>
				<!-- /Copyright text -->
			</div>
		</div>
	</footer>
</div>
<script type="text/javascript" src="/js/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery/jquery-migrate.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/jquery/js.cookie.min.js"></script>
<!-- OPEN LIBS JS -->
<script type="text/javascript" src="/js/owl-carousel/owl.carousel.min.js"></script>
<script type="text/javascript" src="/js/slick-1.6.0/slick.min.js"></script>
<script type="text/javascript" src="/js/yith-woocommerce-compare/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="/js/sw_core/isotope.js"></script>
<script type="text/javascript" src="/js/sw_core/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="/js/sw_woocommerce/category-ajax.js"></script>
<script type="text/javascript" src="/js/sw_woocommerce/jquery.countdown.min.js"></script>
<script type="text/javascript" src="/js/wc-quantity-increment.min.js"></script>
<script type="text/javascript" src="/js/woocommerce/cart.min.js"></script>
<script type="text/javascript" src="/js/js_composer/js_composer_front.min.js"></script>
<script type="text/javascript" src="/js/plugins.js"></script>
<script type="text/javascript" src="/js/megamenu.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript" src="/js/axios.min.js"></script>
<script type="text/javascript" src="/js/vue.js"></script>
</body>
</html>
<script>
	new Vue({
		el:"#app",
		data:{
			cartList:[],
			userId:'',
			collectId:'',
			userName:'',

			clsinfo:[],
			stu:{
				stuInterest:[],
				stu_interest:''
			}
		},
		methods:{

			loginout:function () {
				window.localStorage.setItem("userName","");
			},

			//del
			delcoll:function (collectId){
				axios.get('/like/del', {
					params: {
						collectId: collectId
					}
				}).then(function (response){
					//console.log(Response.data);
				})
						.catch(function (error){
							console.log(error);
						});
				location.href="cart.html"
			}
			},
		mounted(){
			_this= this
			var userId =window.localStorage.getItem("userId")
			var userName =window.localStorage.getItem("userName")

			//查
			axios.get('like/find',{
				params: {
					userId:userId
				}
			}).then(function (response) {
				_this.cartList=response.data.object;
				console.log(_this.cartList);
			})
					.catch(function (error) {
						console.log(error);
					});
		}

	})
</script>